<template>
    <div>
      <!-- Breadcrumb navigation -->
      <el-breadcrumb separator="/">
        <el-breadcrumb-item>
          <router-link to="/user/location">党建地点</router-link>
        </el-breadcrumb-item>
        <el-breadcrumb-item>党建地点详细信息</el-breadcrumb-item>
      </el-breadcrumb>
  
      <!-- Display the detailed location info -->
      <h2>地点详细信息：{{ locationName }}</h2>
      <div v-if="locationDetails">
        <p><strong>地点 ID:</strong> {{ locationDetails.id }}</p>
        <p><strong>地点名称:</strong> {{ locationDetails.name }}</p>
        <p><strong>其他信息:</strong> {{ locationDetails.otherInfo }}</p>
      </div>
  
      <h3>所有地点数据:</h3>
      <ul>
        <li v-for="location in allLocations" :key="location.id">
          {{ location.name }} (ID: {{ location.id }})
        </li>
      </ul>
    </div>
  </template>
  
  <script>
  import { selectByNameService, LocationListService } from '@/api/location.js'; // 更新服务导入路径
  
  export default {
    data() {
      return {
        locationId: this.$route.params.locationId,
        locationName: this.$route.params.locationName,
        locationDetails: null,
        allLocations: []
      };
    },
    created() {
      this.fetchLocationDetails();
      this.fetchAllLocations();
    },
    methods: {
      async fetchLocationDetails() {
        try {
          const response = await selectByNameService(this.locationName);
          this.locationDetails = response.data; // 根据实际返回的数据格式调整
          console.log('Location Details:', this.locationDetails);
        } catch (error) {
          console.error('Error fetching location details:', error);
        }
      },
  
      async fetchAllLocations() {
        try {
          const response = await LocationListService({ page: 1, size: 10 }); // 请根据需要的页面大小进行调整
          this.allLocations = response.data.list; // 根据实际返回的数据格式调整
          console.log('All Locations:', this.allLocations);
        } catch (error) {
          console.error('Error fetching all locations:', error);
        }
      }
    }
  };
  </script>
  
  <style scoped>
  /* 在这里添加你的样式 */
  </style>
  